<!DOCTYPE html>
<html>
<head>
    <title>Web Tranh</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="language" content="en" />
    <link rel="stylesheet" href="css/style.css"/>
    <link rel="stylesheet" href="css/style1.css"/>
    <link rel="stylesheet" href="lib/bootstrap/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="css/default.css"/>
    <link rel="stylesheet" href="css/nivo-slider.css"/>
    <link rel="stylesheet" href="css/slider.css"/>
    <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
    <script type="text/javascript" src="js/jquery-1.9.0.js"></script>
    <script type="text/javascript" src="js/jquery.nivo.slider.js"></script>
    <script type="text/javascript" src="lib/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/javascript.js"></script>
    <script type="application/javascript">
        $(function() {
            $('.order').tooltip();
            $('.detail').tooltip();
            $('#addtoorder').click(function(){
                var exist = $('#existitem').html();
                exist = Number(exist);
                alert(1);
                var mountbuyitem = $('#mountbuyitem').val();
                if(mountbuyitem!='')
                {
                    mountbuyitem = Number(mountbuyitem);
                    if(exist < mountbuyitem)
                    {
                        alert('Số Lượng Mua Qúa Lớn Chúng Tôi Không Đáp Ứng Được');
                    }
                    else
                    {
                        var mountitem = $('#countitem').html();
                        mountitem = Number(mountitem);
                        mountitem = mountitem+mountbuyitem;
                        var totalmoney = $('#totalmoney').html();
                        totalmoney = totalmoney.replace(/,/g,'');
                        totalmoney = Number(totalmoney);
                        $('#countitem').html(mountitem);
                        var name = $('#name').html();
                        var cost = $('#cost').html();
                        var productid = $('#productid').html();
                        var lastindex = cost.lastIndexOf('0');
                        cost = cost.slice(0,lastindex+1);
                        cost = cost.replace(/,/g,'');
                        cost = Number(cost);
                        $.ajax({
                            type: 'POST',
                            data: 'id='+ productid+'&mountbuy='+mountbuyitem+'&cost='+cost+'&name='+name,
                            url:'../CONTROLLER/ordercontroller.php',
                            success: function(data)
                            {

                            }
                        });
                    }
                }


            });
            $('.order').click(function(){
                var productid = $(this).attr('id');
                var mountitem = $('#countitem').html();
                mountitem = Number(mountitem);
                mountitem = mountitem+1;
                var totalmoney = $('#totalmoney').html();
                $('#countitem').html(mountitem);
                var parent = $(this).parent().parent().parent();
                var cost = parent.children('.cost').html();
                var name = parent.children('.name');
                name = name.children('a').html();
                var lastindex = cost.lastIndexOf('0');
                cost = cost.slice(0,lastindex+1);
                cost = cost.replace(/,/g,'');
                totalmoney = totalmoney.replace(/,/g,'');
                cost = Number(cost);
                totalmoney = Number(totalmoney);
                $.ajax({
                    type: 'POST',
                    data: 'id='+ productid+'&mountbuy='+1+'&cost='+cost+'&name='+name,
                    url:'../CONTROLLER/ordercontroller.php',
                    success: function(data)
                    {

                    }
                });

            });



        });
    </script>
    <script type="text/javascript">var switchTo5x=true;</script>
    <script type="text/javascript" src="js/buttons.js"></script>
    <script type="text/javascript">stLight.options({publisher: "be46808d-fb43-4091-87d7-2af542271e2e", doNotHash: false, doNotCopy: false, hashAddressBar: false});</script>
</head>
<body>
<div class="container">
    <div class="banner">

    </div>
    <div id="search">
        <img src="css/toolbar_find.png" alt=""/>
        <input type="search" name="search" width="260px" value="Tìm Kiếm Tranh"/>

    </div>
    <div class="nav-horizontal ribbon">
        <a href="#"><span>Trang Chủ</span></a>
        <a href="#"><span>Phòng Tranh</span></a>
        <a href="#"><span>Liên Hệ</span></a>
        <a href="#"><span id="pay">Thanh Toán</span></a>
        <a href="#"><span><i class="iconorder"></i> <i class="item" id="countitem">0</i></span></a>
    </div>
    <div class="main">
        <div class="nav-vertical">
            <ul class="ca-menu">
                <li>
                    <a href="#">
                        <span class="ca-icon">I</span>
                        <div class="ca-content">
                            <h2 class="ca-sub">Tranh Thêu</h2>
                        </div>
                    </a>
                </li>
                <li class="selected">
                    <a href="#">
                        <span class="ca-icon">I</span>
                        <div class="ca-content">
                            <h2 class="ca-sub">Tranh Sơn Dầu</h2>
                        </div>
                    </a>

                </li>
                <li>
                    <a href="#">
                        <span class="ca-icon">I</span>
                        <div class="ca-content">
                            <h2 class="ca-sub">Tranh Đá Qúy</h2>
                        </div>
                    </a>

                </li>
                <li>
                    <a href="#">
                        <span class="ca-icon">I</span>
                        <div class="ca-content">
                            <h2 class="ca-sub">Tranh Màu Nước</h2>
                        </div>
                    </a>

                </li>
                <li>
                    <a href="#">
                        <span class="ca-icon">I</span>
                        <div class="ca-content">
                            <h2 class="ca-sub">Tranh Màu Nước</h2>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <span class="ca-icon">I</span>
                        <div class="ca-content">
                            <h2 class="ca-sub">Tranh Thư Pháp</h2>
                        </div>
                    </a>
                </li>
            </ul>
            <ul>
                <li style="margin-bottom: 10px">
                    <span>Mr Nguyen: -013123354</span>
                    <a href="ymsgr:sendim?nguyen_tranchi" border="0">
                        <img src="http://opi.yahoo.com/online?u=nguyen_tranchi&amp;t=1">
                    </a>
                </li>
            </ul>
            <div class="fb-like-box" data-href="https://www.facebook.com/FacebookDevelopers" data-width="250px" data-height="500px" data-header="true" data-show-border="true">
            </div>

        </div>

        <div class="content" id="showall">
            <div class="product">
                <img src="images/17.jpg" alt="" class="image"/>
                <legend class="name" id="name">Lan Đỏ</legend>
                <br>
                <legend class="status">Tình Trạng:&nbsp <i id="existitem">3</i> &nbspBức Tranh</legend>
                <br>
                <legend class="cost" >Giá : <i id="cost">4,000,000</i>  vnđ</legend>
                <br>
                <legend class="productid" >Mã Sản Phẩm : <i id="productid">1</i></legend>
                <br>
                <legend class="mount"> <b>Số Lượng :</b>  <input type="text" id="mountbuyitem"/></legend>
                <br>
                <div style="width: 500px;float: left">
                    <input type="button" value="Thêm vào giỏ hàng" id="addtoorder"/>
                </div>
                <span class="st_sharethis_vcount" style="float: left;" displayText='ShareThis'></span>
                <span class='st_facebook_vcount' style="float: left;" displayText='Facebook'></span>
                <span class='st_twitter_vcount' style="float: left;" displayText='Tweet'></span>
                <span class='st_linkedin_vcount' style="float: left;" displayText='LinkedIn'></span>
                <span class='st_pinterest_vcount' style="float: left;" displayText='Pinterest'></span>
                <span class='st_email_vcount' style="float: left;" displayText='Email'></span>
                <div class="info">
                    <label>Chi Tiết Sản Phẩm</label>
                    <hr>
                    <span>
                            blabalahalal
                    </span>
                </div>
                <article>Sản Phẩm Tương Tự</article>
                <div class="card">

                    <img src="images/17.jpg" alt=""/>
                    <span class="name"> <a href="#">Lan Đỏ</a> </span>

                    <span class="size">Kích Thước: 50cm x 50cm </span>

                    <span class="cost">4,000,000 vnđ</span>
                    <ul class="icon">
                        <li><a href="#" title="Thêm vào giỏ hàng" class="order" id="4"></a></li>
                        <li><a href="#" title="Chi tiết" class="detail"></a></li>
                    </ul>
                </div>
                <div class="card">

                    <img src="images/17.jpg" alt=""/>
                    <span class="name"> <a href="#">Lan Đỏ</a> </span>
                    <span class="size">Kích Thước: 50cm x 50cm </span>
                    <span class="cost">4,000,000 vnđ</span>
                    <ul class="icon">
                        <li><a href="#" data-toggle="tooltip" data-original-title="Thêm vào giỏ hàng" title="Thêm vào giỏ hàng" class="order"></a></li>
                        <li><a href="#" data-toggle="tooltip" data-original-title="Xem Chi Tiết" title="Chi tiết" class="detail"></a></li>
                    </ul>
                </div>
                <div class="card">
                    <img src="images/17.jpg" alt=""/>
                    <span class="name"> <a href="#">Lan Đỏ</a></span>
                    <span class="size">Kích Thước: 50cm x 50cm </span>
                    <span class="cost">4,000,000 vnđ</span>
                    <ul class="icon">
                        <li><a href="#" title="Thêm vào giỏ hàng" class="order" id="3"></a></li>
                        <li><a href="#" title="Chi tiết" class="detail"></a></li>
                    </ul>
                </div>
                <div class="card">
                    <img src="images/17.jpg" alt=""/>
                    <span class="name"> <a href="#">Lan Đỏ</a></span>
                    <span class="size">Kích Thước: 50cm x 50cm </span>
                    <span class="cost">4,000,000 vnđ</span>
                    <ul class="icon">
                        <li><a href="#" title="Thêm vào giỏ hàng" class="order" id="1"></a></li>
                        <li><a href="#" title="Chi tiết" class="detail"></a></li>
                    </ul>
                </div>
                <div class="card">
                    <img src="images/17.jpg" alt=""/>
                    <span class="name"> <a href="#">Lan Đỏ</a></span>
                    <span class="size">Kích Thước: 50cm x 50cm </span>
                    <span class="cost">4,000,000 vnđ</span>
                    <ul class="icon">
                        <li><a href="#" title="Thêm vào giỏ hàng" class="order" id="2"></a></li>
                        <li><a href="#" title="Chi tiết" class="detail"></a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="footer">
        <legend>
            Thông tin abcdd
        </legend>
    </div>
    <div id="fb-root"></div>
</div>

</body>
</html>